import { defineStore } from 'pinia'
import { ref, computed} from 'vue'
import axios from 'axios'

export const useChannelsStore = defineStore('channels', () => {
  const channels = ref([])

  const fetchChannels = async () => {
    const res = await axios.get('http://geek.itheima.net/v1_0/channels')
    channels.value = res.data.data.channels
  }

  const channelsName = computed(() => {
    return channels.value.map(item => item.name)
  })

  return {
    channels,
    fetchChannels,
    channelsName
  }
}, {
  persist: {
    key: 'channels',
    storage: sessionStorage
  }
})
